/*
 * Copyright (c) 2010, yuandot Inc. All rights reserved.
 * web site: www.yuandot.com
 * Code licensed under the BSD License
 * version: 0.1
 */
/*******************************************************************************
 * public
 ******************************************************************************/
* body {
    padding: 0; margin: 0;
    font-size: 12px;
    font-weight: normal;
}
a { font-size: 12px; font-weight: normal; }

ul { padding: 0; margin: 0; }
ul li { list-style: none; }


.red { color: red; }
.green { color: green; }
.black { color: black; }
.bold { font-weight: bold; }

.hidden { display: none; }
.clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
.clearfix {
    zoom:1;
    display: inline-block;
    _height:1px;
}
/* Hides from IE-mac */
* html .clearfix { height: 1%; }
*+html .clearfix { height: 1%; }
.clearfix { display: block; }
/* End hide from IE-mac */
.hide { display: none; }
.btn {
    margin: 2px 3px;
    padding: 2px 5px;
    *padding: 4px 5px 1px;
    border-color: #ddd;
    background: #ddd;
    color: #000;
    cursor: pointer;
    vertical-align: middle;

    /*width: 87px; height: 30px; line-height: 30px; border: none;
    cursor: pointer; font-weight: normal; text-align: center; color: #fff;
    letter-spacing: 0.5em;
    background:url(images/bg_btn.png) no-repeat left top;*/
}
.btn_delete {
    width: 80px;
    height: 30px;
    line-height: normal;
    border: none;
    text-align: center;
    margin-left: 15px;
    font-weight: bold;
    cursor: pointer;
    background: url(images/bg_btn_delete.png) no-repeat left 50%;
}
div.notice, div.success {
    width: 100%;
    background: #E6EFC2 url(images/notice.png) no-repeat left 50%;
    color: #264409;
    padding: .8em;
    padding-left: 3em;
    margin-bottom: 1em;
    border-top: 1px solid #C6D880;
    border-bottom: 1px solid #C6D880;
    font-size: 1.1em;
    font-weight: normal;
}
/*******************************************************************************
 * YUI Grid Css setting
 ******************************************************************************/
#hd { padding: 0; margin: 0; }
#doc3 { padding: 0; margin: 0; }
.yui-g { padding: 0; margin: 0; }
/*******************************************************************************
 * Header
 ******************************************************************************/
#header {
    position: relative;
    height: 45px;
    overflow: hidden;
    background: #333 url(images/bg-header.gif) repeat-x;
}
#desktopTitlebar {
    padding: 7px 8px 6px 8px;
    height: 32px;
    background: url(images/logo.gif) no-repeat;
    background-position: left 0;
}
#desktopTitlebar h1.applicationTitle {
    display: none;
    margin: 0;
    padding: 0 5px 0 0;
    font-size: 20px;
    line-height: 25px;
    font-weight: bold;
    color: #fff;
}
#desktopTitlebar h2.tagline {
    height: 32px;
    line-height: 32px;
    font-size: 12px;
    color: #b2b2b2;
    font-weight: bold;
    padding: 0;
    margin: 0;
    text-align: center;
}
#desktopTitlebar h2.tagline .taglineEm {
    font: 1.6em Georgia,serif;
}
#topNav {
    /*font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 10px;*/
    font-weight: normal;
    position: absolute;
    right: 0;
    top: 0;
    color: #fff;
    text-align: right;
    padding-right: 16px;
    font: 1.1em Georgia,serif; 
    /*padding: 13px 10px 0 0;*/
}

ul.header_menu_right li {
    height: 45px;
    line-height: 45px;
    list-style-type: none;
    /*display: block;*/
    float: left;
}
ul.header_menu_right li.split {
    width: 36px;
    height: 45px;
    float: left;
    background: url(images/header_menus_item_split.jpg) no-repeat 50% 50%;
}
ul.header_menu_right li a {
    font: 1.1em Georgia,serif; text-decoration: none; color: #fff; font-weight: bold;
}

ul.header_menu_right li a:hover {
    border-bottom: #595959 solid 2px;
}
/*******************************************************************************
 * menu
 ******************************************************************************/
.menu { width:100%; margin:0 auto; overflow:hidden;}
.outers { background: url(images/menu_sprites.png) no-repeat top left 10px;}
.inners { background: url(images/menu_sprites.png) no-repeat top right; padding-right:5px;}
.menu ul{  background: url(images/menu_sprites.png) repeat-x 0 -102px; height:34px; }
.menu li {list-style: none; float:left; width:auto !important; width:1%; white-space:nowrap; padding:0 5px; background:url(images/menu_sprites.png) no-repeat bottom left;}
.menu li a { display:block; text-decoration: none; padding-left:15px; cursor:pointer; }
.menu li a span { display:block;height:34px; line-height:34px; color: #fff; padding-right:15px; }
.menu li a:hover { background: url(images/menu_sprites.png) no-repeat left -68px; }
.menu li a:hover span { background: url(images/menu_sprites.png) no-repeat right -68px; }
.menu li.selected a { background: url(images/menu_sprites.png) no-repeat left -34px; }
.menu li.selected a span { background: url(images/menu_sprites.png) no-repeat right -34px; color: #7DD0FA; font-weight: bold; }
/*******************************************************************************
 * footer
 ******************************************************************************/
#footer {
    height: 30px; line-height: 30px; background-color: #333; color: #b2b2b2;
    padding-left: 30px; font-size: 90%;
}
#footer a { color: #1F7BC8; }

/*******************************************************************************
 * default page show
 ******************************************************************************/
/* navigation */
#nav {
    background: #ddd url(images/h300_reverse.png);
    border-bottom: 1px solid #CCCCCC;
    height: 156px;
    width: 100%;
}
#nav ul {
    width: 600px;
    margin: 0 auto;
}
#nav li {
    border-right: 1px solid #ddd;
    float: left;
    padding-left: 1px;
    width: 175px;
    list-style-type: none;
    text-align: center;
}
#nav a {
    color:#333333;
    display: block;
    padding: 17px;
    position: relative;
    /*word-spacing: -2px;*/
    font-size: 1em;
    height:122px;
    text-decoration:none;
}
#nav a.current {
    background: url(images/down_large.jpg) no-repeat;
}
#nav img {
    background-color: #fff;
    border: 1px solid #ccc;
    margin: 3px 0 5px 27px;
    padding: 4px;
    display: block;
}
#nav strong {
    display: block;
    font-size: 1.4em;
}
/*******************************************************************************
 * panes
 ******************************************************************************/
#panes {
    background: #fff url(images/h300_reverse.png) repeat scroll 0 0;
    width: 100%;
    height: 255px;
    margin-bottom: -20px;
    padding-bottom: 20px;
    /* must be relative so the individual panes can be absolutely positioned */
    position:relative;
}

/* crossfading effect needs absolute positioning from the elements */
#panes div {
    display:none;
    position:absolute;
    top:20px;
    left:20px;
    font-size:14px;
    color:#444;
    width: 100%;
}

#panes img {
    float: left;
    margin-right: 20px;
    padding: 3px;
    border: #aaa solid 1px;
}

#panes p.more {
    color: #aaa;
    font-size: 1.5em;
    font-weight: normal;
    font-style: italic;
    margin-left: 2em;
}

#panes h3 {
    margin:0;
    font-size: 2.5em;
    font-weight: bold;
}
.overlay {
    display:none;
    width:500px;
    padding:20px;
    background-color:#ddd;
}
#panes ul {
    margin: 20px 0 10px 20px;
}
#panes ul li {
    list-style: square;
}
#panes ul.infos { margin: 20px 0 10px 20px; }
#panes ul.infos li { list-style: square; }
#panes ul.infos li span { width: 100px; font-weight: bold; }
/*******************************************************************************
 * Model Actions Toolbar
 ******************************************************************************/
div.model_actions_toolbar {
    height: 35px;
    line-height: 35px;
    background: url(images/bg_table_header.gif) repeat-x;
}
/*******************************************************************************
 * model actions
 ******************************************************************************/
ul.model_actions {
    padding: 0; margin: 0; margin-left: 50px;
}
ul.model_actions li {
    list-style: none;
    float: left;
    padding-left: 20px;
    margin-left: 40px;
}
ul.model_actions li a { text-decoration: none; padding-right: 15px; font-weight: bold; }
ul.model_actions li.first { margin-left: 0; }
ul.model_actions li.create { background: url(images/add.png) no-repeat left 50%; }
ul.model_actions li.list { background: url(images/home.png) no-repeat left 50%; }
ul.model_actions li a.current {
    background: url(images/arrow_left.gif) no-repeat right 50%;
}
/*******************************************************************************
 * Datas Grid
 ******************************************************************************/
table.datas_grid {
    border: #ccc solid 1px;
    padding: 0;
    margin: 0;
    margin-top: 1px;
}
table.datas_grid thead tr {
    height: 35px;
    background: url(images/bg_table_header.gif) repeat-x;
}
table.datas_grid thead tr th {
    border: none;
    border-bottom: #ccc solid 1px;
    text-align: left;
    padding-left: 4px;
    color: #7DD0FA;
}
table.datas_grid thead tr th a { color: #7DD0FA; font-size: 1em; font-weight: bold; }


/* 单元格宽度设置 */
table.datas_grid tbody tr td span.id {
    font-weight: bold; padding-right: 6px;
}
table.datas_grid tbody tr td span.owner_user,
table.datas_grid tbody tr td span.owner_user a {
    font-weight: normal; padding-left: 12px; color: #aaa;
}
table.datas_grid tbody tr td.sn {
    width: 3em;
    font-weight: bold;
    color: #aaa;
}
table.datas_grid tbody tr td.sn_and_checkbox,
table.datas_grid tbody tr td.sn_and_checkbox a {
    width: 60px; font-weight: bold; color: #aaa;
}
table.datas_grid tbody tr td.icon { width: 2em; }
table.datas_grid tbody tr td.status { width: 3em; }
table.datas_grid tbody tr td.order_pos { width: 4em; }
table.datas_grid tbody tr td.numerical { width: 3em; }
table.datas_grid tbody tr td.numerical_one { width: 4em; }
table.datas_grid tbody tr td.numerical_two { width: 5em; }
table.datas_grid tbody tr td.count { width: 5em; }
table.datas_grid tbody tr td.date { width: 7em; }
table.datas_grid tbody tr td.sex { width: 3em; }
table.datas_grid tbody tr td.url { width: 5em; }
table.datas_grid tbody tr td.link_open_target { width: 5em; }
table.datas_grid tbody tr td.action { width: 1em; }
table.datas_grid tbody tr td.action_one { width: 5em; }
table.datas_grid tbody tr td.action span,
table.datas_grid tbody tr td.action_one span {
    padding: 0 4px;
}
/* // 单元格宽度设置 */

table.datas_grid tbody tr td input.numerical {
    width: 3em;
    border: #aaa solid 1px;
    padding: 2px;
}
table.datas_grid tbody tr td input.numerical_is_changed {
    width: 3em;
    border: none;
    border-bottom: #aaa solid 1px;
    padding: 2px 0 2px 20px;
    background: url(images/20080523163153389.png) no-repeat left 50%;
    color: red;
    font-weight: bold;
}
table.datas_grid tbody tr td {
    border: none;
}
table.datas_grid tbody tr.even {
    background-color: #E1E1E1;
}
table.datas_grid tbody tr.over td {
    background: #FFEEEE;
}
table.datas_grid tfoot tr td {
    border: none;
    border-top: #ccc dashed 1px;
}
/*******************************************************************************
 * Data Grid
 ******************************************************************************/
table.data_grid {
    border: none; width: 100%;
}
table.data_grid tr th, td { border: #ccc solid 1px; }
table.data_grid tr th {
    width: 120px; text-align: right;
}
table.data_grid tr th label { font-weight: bold; }
/*******************************************************************************
 * Box Container
 ******************************************************************************/
.box_container {
    width: 96%;
    margin: 2%;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    background: #FBE3E4;
    color: #8a1f11;
}
.box_container div.row {
    width: 100%; line-height: 25px;
}
.box_container div.row_btns {
    width: 100%; margin: 10px 0; padding: 10px 0 0 10px;
    border-top: 1px solid #ddd;
}
/*******************************************************************************
 * dotForm
 ******************************************************************************/
form.dot_from {
    padding: 0; margin: 0;
}
/* form width */
.fw_20 { width: 10em; padding: 0 auto; margin: 0 auto; }
.fw_50 { width: 50em; padding: 0 auto; margin: 0 auto; }
.fw_60 { width: 40em; padding: 0 auto; margin: 0 auto; }
/* // form width */
form.dot_form {
    width: 100%;
    height: 100%;
}
form.dot_form dl {
    padding: 0; margin: 0;
}
form.dot_form dl dt {
    width:100px;
    color:#000;
    float:left;
    font-weight:bold;
    margin-right:10px;
    padding:5px;
}
form.dot_form label.required {
    font-weight: bold;
}
form.dot_form label span.required { color: red; }
form.dot_form dl dd {
    margin: 2px 0;
    padding: 5px 0;
    background-color: #F0F0F0;
}
form.dot_form dl dd span.split { padding: 0 2px; }
form.dot_form dl dd label { padding: 0 10px; font-weight: bold; }
form.dot_form dl dd input {
    height: 16px;
    line-height: 16px;
    padding: 2px;
    border-top: #aaa solid 2px;
}
form.dot_form input.checkbox { vertical-align: middle; }
form.dot_form dl dd input.small { width: 160px; }
form.dot_form dl dd input.medium { width: 260px; }
form.dot_form dl dd input.large { width: 400px; }
form.dot_form dl dd input.num { width: 80px; }
form.dot_form dl dd input.error {
    background-color: #FFEEEE;
}
form.dot_form dl dd div.errorMessage {
    border-top: 1px solid #D9C3C3;
    border-bottom: 1px solid #D9C3C3;
    padding: 10px 0 10px 40px;
    background: #FFE6E6 url(images/note.gif) no-repeat left 50%;
    font-size: 0.9em;
    font-weight: bold;
    color: #FF2A00;
}
form.dot_form dl dd input.btn {
    height: 30px;
    line-height: 30px;
    margin: 2px 0;
    padding: 2px 5px;
    *padding: 4px 5px 1px;
    border-color: #ddd #666 #666 #ddd;
    background: #ddd;
    color: #000;
    cursor: pointer;
    vertical-align: middle;
}
/*******************************************************************************
 * fieldset 美化
 ******************************************************************************/
fieldset {
    padding: 10px;
    margin-top: 5px;
    border: 1px solid #FED36C;
    background: #fff;
}
fieldset legend {
    color: #FED36C;
    font-weight: bold;
    padding: 3px 20px 3px 20px;
    border: 1px solid #FED36C;
    background: #fff;
}
/*******************************************************************************
 * nodes tree view
 ******************************************************************************/
.nodes_tree_view {
    width: 100%;
    background: #FEC368;
}
.nodes_tree_view ul { padding: 10px 10px 10px 10px; }
.nodes_tree_view ul li { list-style: none; }
.nodes_tree_view ul li span { font-weight: bold; padding-left: 5px; text-align: left; vertical-align: middle; }
.nodes_tree_view ul li span.order_pos, span.type { margin-left: 6px; padding: 0px 5px; background-color: #000; color: #fff; }
.nodes_tree_view ul li a { text-decoration: none; }
.nodes_tree_view ul li a.current {
    padding-left: 10px;
    background: url(images/20080523163153905.png) no-repeat left;
    color: red;
}
/*******************************************************************************
 * Media Files For Icons list
 ******************************************************************************/
ul#media_files_icons_list{}
ul#media_files_icons_list li {
    float: left; margin: 12px; _margin: 12px; position: relative; width: 180px; height: 160px;
}
ul#media_files_icons_list li  div.icon {
    position: relative; width: 180px; height: 132px; background: #fff;
    border: #ccc solid 1px; text-align: center;
}
ul#media_files_icons_list li  div.icon img { margin: 2px; width: 128px; height: 128px; }
ul#media_files_icons_list li  div.icon span.other_action {
    width: 20px; height: 18px; display: block; position: absolute; top: 2px; left: 2px;
    background: url(images/photo.gif) no-repeat;
}
ul#media_files_icons_list li  div.icon span.delete_action {
    width: 24px; height: 24px; display: block; position: absolute; top: 105px; left: 150px;
    background: url(images/icon_delete.png) no-repeat;
}
ul#media_files_icons_list li  div.icon a { text-decoration: none; }
ul#media_files_icons_list li  div.icon a:hover span.other_action { background-position: left -22px; }
/*ul#media_files_icons_list li  div.icon a:hover span.delete_action { background-position: left -22px; }*/
ul#media_files_icons_list li h4 {
    width: 100%;
    height: 30px;
    line-height: 30px;
    color: #ccc;
    text-align: left;
    font-size: 12px;
    font-weight: normal;
    border:none;
}
ul#media_files_icons_list li h4 sup { font-weight: bold; float: right; }
/*******************************************************************************
 *  Media Finder Toolbar
 ******************************************************************************/
.toolbar_media_finder {
    padding: 5px 10px; margin: 0;
    border-top: #ccc solid 1px;
    border-bottom: #ccc solid 1px;
}
.toolbar_media_finder div.media_categories_select {
    width: 300px; float: left; padding-right: 10px;
    height: 32px; line-height: 32px;
}
.toolbar_media_finder div.media_search {
    float: left; padding-left: 30px;
}
.toolbar_media_finder div.media_search form { padding: 0; margin: 0; }
.toolbar_media_finder div.media_search form input.sw {
    height: 25px; line-height: 25px; border: #389be5 solid 1px;
    padding-left: 30px; background: url(images/icon_search.gif) no-repeat left 50%;
}
.toolbar_media_finder form { padding: 0; margin: 0; }

/*******************************************************************************
 * JQuery Auto Complete Fix
 ******************************************************************************/
.ac_results_fix {
    padding: 0px;
    border: 1px solid WindowFrame;
    background-color: Window;
    overflow: hidden;
}
.ac_results_fix ul {
    width: 100%;
    list-style-position: outside;
    list-style: none;
    padding: 0;
    margin: 0;
}
.ac_results_fix iframe {
    display:none;/*sorry for IE5*/
    display/**/:block;/*sorry for IE5*/
    position:absolute;
    top:0;
    left:0;
    z-index:-1;
    filter:mask();
    width:3000px;
    height:3000px;
}
.ac_results_fix li {
    width: 90%;
    margin: 0px;
    padding: 8px 0;
    padding-left: 10%;
    /*margin-left: 5%;*/
    border-bottom: #ccc solid 1px;
    cursor: pointer;
    display: block;
    font: menu;
    font-size: 12px;
    overflow: hidden;
    text-align: left;
}
/*******************************************************************************
 * media show
 ******************************************************************************/
#media_show { width: 600px; padding: 10px; margin: 10px; border: #aaa solid 1px; }
#media_show div#media_icon {
    width: 200px;
    float: left;
}
#media_show div#media_icon img { width: 128px; height: 128px; padding:  2px; border: #ccc solid 1px; }
#media_show div#media_infos {
    width: 400px;
    float: right;
}
#media_show div#media_infos h4.file_name {
    padding: 5px 0; font-size: 1.3em; font-weight: bold; border-top: #aaa solid 1px; border-bottom: #aaa solid 1px;
}
#media_show div#media_infos h4.file_name span { float: right; padding: 0 4px; border: #000 solid 1px; color: #000; }
#media_show div#media_infos ul { margin-top: 10px; }
#media_show div#media_infos ul li {
    list-style: square; font-size: 1.1em; height: 25px; line-height:  25px;
}

/*******************************************************************************
 * search
 ******************************************************************************/
#search {
    font-family: Arial, Helvetica, sans-serif;
    display: block;
    width: 600px;
    height: 32px;
}
#search form { padding: 0; margin: 0; }
#search input {
    font-family: Arial, Helvetica, sans-serif;
    background: transparent url(images/bg_search.png) no-repeat scroll 0 0;
    border: none;
    font-size: 1.0em;
    color: #444444;
    padding: 6px 10px 8px 10px;
    width: 300px;
    float: left;
}
#search input:focus, #search input:hover, #search button:focus, #search button:hover {
    background: transparent url(images/bg_search.png) no-repeat scroll -312px 0;
}
#search input.btn {
    font-family: Arial, Helvetica, sans-serif;
    background: transparent url(images/bg_search.png) no-repeat scroll -202px 0px;
    border: none;
    font-size: 1.0em;
    color: #952200;
    padding: 0px 10px 0px 10px;
    font-weight: bold;
    height: 32px;
    width: 110px;
    float: left;
}
#search button:focus, #search button:hover {
    background: transparent url(images/bg_search.png) no-repeat scroll -514px 0px;
    color: #fff;
}

/*******************************************************************************
 * data loading
 ******************************************************************************/
div.datasLoading {
    width: 100%;
    text-align: center;
    height: 150px;
    float: right;
    text-indent: -9999em;
    background-position: center center;
    background-repeat: no-repeat;
    opacity: 1;
    background-image: url(images/ajaxLoader.gif);
}
div.datasLoading * {
    opacity: .2em;
}